<template>
    <el-collapse accordion>
      <el-collapse-item :title="d.name" :name="d.id" v-for="d in depts" :key="d.id" >
        <div class="txt">
          {{d.txt}}
        </div>
        <div class="link">
          电话号码:{{d.phone}}  位置:{{d.loc}} 
          <span class="btn_doc">
           <router-link :to="{path:'/doctors',query:{deptname:d.name}}" > 
              <el-button type="success" round size="small">查看医生</el-button>
           </router-link>
          </span>
        </div>
      </el-collapse-item>
    </el-collapse>
</template>

<script>
export default {
   inject:["global"],
   data(){
       return{
           depts:[]
       }
   },
   mounted:function(){
       const axios=this.global.axios;
       axios.get("http://192.168.2.5:9000/hp/dept/all")
       .then(resp=>{
           this.depts=resp.data.obj;
       })
   }
}
</script>

<style scoped>
   .txt,.link{text-align: left;}
   .btn_doc{float:right}
</style>